<!DOCTYPE html>
<html lang="en" ng-app="app" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>TERM-后台管理系统</title>
    <link th:href="@{/static/images/term.ico}" th:mce_href="images/tab_icon.ico" rel="icon" type="image/x-icon"/>
    <link rel="stylesheet" href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css"/>
    <link rel="stylesheet" type="text/css" href="/static/lib/bootstrap-datetimepicker.min.css"/>
    <link rel="stylesheet" type="text/css" href="/static/css/main.css"/>
    <link rel="stylesheet" type="text/css" href="/static/lib/bootstrapValidator.min.css"/>
    <style>
        .iframe-context{
            width: 100%;
            position: absolute;
            top: 88px;
            left: 0;
        }
        .form-horizontal .form-group{
            margin: 37px 0 0 0;
        }
        button[type="button"]{
            margin-left: 199px;
            margin-top: 37px;
        }
        [ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
            display: none !important;
        }
    </style>
</head>

<body ng-controller="companyController">
<div class="header" th:include="header"></div>
<div class="iframe-context">
    <form id="companyForm" class="form-horizontal" novalidate="novalidate" th:action="@{/term/company/add}" method="post">
        <div class="form-group">
            <label for="name" class="col-sm-1 control-label">公司名</label>
            <div class="col-sm-3">
                <input type="text" class="form-control" name="name" placeholder="公司名称" ng-model="postData.name"/>
            </div>
        </div>
        <div class="form-group">
            <label for="address" class="col-sm-1 control-label">地址</label>
            <div class="col-sm-3">
                <input type="text" class="form-control" name="address" placeholder="公司地址" ng-model="postData.address"/>
            </div>
        </div>
        <div class="form-group">
            <label for="contacts" class="col-sm-1 control-label">联系人</label>
            <div class="col-sm-3">
                <input type="text" class="form-control" name="contacts" placeholder="对接人姓名" ng-model="postData.contacts"/>
            </div>
        </div>
        <div class="form-group">
            <label for="mobile" class="col-sm-1 control-label">手机号</label>
            <div class="col-sm-3">
                <input type="text" class="form-control" name="mobile" placeholder="对接人手机号" ng-model="postData.mobile"/>
            </div>
        </div>
        <div class="form-group">
            <label for="fax" class="col-sm-1 control-label">传真</label>
            <div class="col-sm-3">
                <input type="text" class="form-control" name="fax" placeholder="对接人传真" ng-model="postData.fax"/>
            </div>
        </div>
        <div class="form-group">
            <label for="email" class="col-sm-1 control-label">邮箱</label>
            <div class="col-sm-3">
                <input type="text" class="form-control" name="email" placeholder="对接人邮箱" ng-model="postData.email"/>
            </div>
        </div>
        <div class="form-group">
            <label for="link" class="col-sm-1 control-label">备用联系方式</label>
            <div class="col-sm-3">
                <input type="text" class="form-control" name="link" placeholder="对接人备用联系方式" ng-model="postData.link"/>
            </div>
        </div>
        <div class="form-group">
            <label for="remark" class="col-sm-1 control-label">备注</label>
            <div class="col-sm-3">
                <textarea class="form-control" name="remark" rows="3" ng-model="postData.remark"/>
            </div>
        </div>
        <button ng-if="!postData.id" ng-cloak="" type="button" class="btn btn-success" ng-click="create($event)">生&nbsp;&nbsp;&nbsp;
            &nbsp;成</button>
        <button ng-if="postData.id" ng-cloak="" type="button" class="btn btn-success" ng-click="update($event)">更&nbsp;&nbsp;&nbsp;
            &nbsp;新</button>
    </form>
</div>
<script type="text/javascript" src="/static/lib/bootstrap.min.js"></script>
<script type="text/javascript" src="/static/lib/angular.min.js"></script>
<script type="text/javascript" src="/static/lib/bootstrap-datetimepicker.min.js"></script>
<script type="text/javascript" src="/static/lib/bootstrap-datetimepicker.zh-CN.js"></script>
<script type="text/javascript" src="/static/lib/bootstrapValidator.min.js"></script>
<script type="text/javascript" src="/static/js/ngPlugin-unCompress.4f7c7e4.js"></script>
<script type="text/javascript" th:inline="javascript">
    //    <![CDATA[
    var app = angular.module('app',['ngPlugin']);
    app.controller('companyController',['$scope','$http','alert',function($scope,$http,alert){
        $scope.config = {
            format : 'hh:ii',
            min:0,
            minuteStep:1
        };
        $scope.postData = {
            id:[[${companyView.value.id}]] || '',
            name:[[${companyView.value.name}]] || '',
            address:[[${companyView.value.address}]] || '',
            contacts:[[${companyView.value.contacts}]] || '',
            mobile:[[${companyView.value.mobile}]] || '',
            fax:[[${companyView.value.fax}]] || '',
            email:[[${companyView.value.email}]] || '',
            link:[[${companyView.value.link}]] || '',
            remark:[[${companyView.value.remark}]] || ''
        };
        $(document).ready(function (e) {
            e.preventDefault;
            $('#companyForm').bootstrapValidator({
                message: 'This value is not valid',
                feedbackIcons: {
                    valid: 'glyphicon glyphicon-ok',
                    invalid: 'glyphicon glyphicon-remove',
                    validating: 'glyphicon glyphicon-refresh'
                },
                fields:{
                    name:{
                        message:'公司名不能为空',
                        validators:{
                            notEmpty:{
                                message:'公司名不能为空'
                            },
                            stringLength:{
                                min:1,
                                max:30,
                                message:'公司名长度不少于1个字符、不超过30个字符'
                            }
                        }
                    },
                    address:{
                        message:'公司地址不能为空',
                        validators:{
                            notEmpty:{
                                message:'公司地址不能为空'
                            },
                            stringLength:{
                                min:1,
                                max:100,
                                message:'公司名长度不少于1个字符、不超过100个字符'
                            }
                        }
                    },
                    contacts:{
                        message:'联系人不能为空',
                        validators:{
                            notEmpty:{
                                message:'联系人不能为空'
                            },
                            stringLength:{
                                min:1,
                                max:20,
                                message:'联系人长度不少于1个字符、不超过20个字符'
                            }
                        }
                    },
                    mobile:{
                        message:'手机号码不能为空',
                        validators:{
                            notEmpty:{
                                message:'手机号码不能为空'
                            },
                            regexp:{
                                regexp:/^[0-9]{11}$/,
                                message:'手机号码格式错误'
                            }
                        }
                    },
                    email:{
                        validators:{
                            notEmpty:{
                                message:'邮箱不能为空'
                            },
                            emailAddress: {
                                message: '邮箱格式错误'
                            }
                        }
                    },
                    link:{
                        message:'备用手机号码不能为空',
                        validators:{
                            notEmpty:{
                                message:'备用手机号码不能为空'
                            },
                            regexp:{
                                regexp:/^[0-9]{11}$/,
                                message:'备用手机号码格式错误'
                            }
                        }
                    }
                }

            })
        });
        $scope.create = function ($event) {
            $event.preventDefault();
            angular.element($event.target).attr('disabled','disabled');
            if(!$('#companyForm').data('bootstrapValidator').isValid()) {
                alert.alert({
                    reason: '请检查表单填写是否正确',
                    message:'保存或编辑失败',
                    type: 'fail',
                    delay: '3'
                });
                angular.element($event.target).attr('disabled',false);
                angular.element($event.target).removeClass('disabled');
            } else {
                var url = angular.element($event.target).parents('form').attr('action');
                $http.post(url,$scope.postData).success(function (data) {
                        if(data.code == 0) {
                            data.detail = data.detail ? data.detail : data.reason;
                            alert.alert({
                                reason: data.detail?data.detail:'此提示3秒后关闭',
                                message: data.msg?data.msg:'保存或编辑成功',
                                type: 'success',
                                delay: '3'
                            });
                            setTimeout(function () {
                                location.href = data.url;
                            }, 3);
                        }else {
                            data.detail = data.detail ? data.detail : data.reason;
                            alert.alert({
                                reason: data.detail ? data.detail : '此提示3秒后关闭',
                                message: data.msg ? data.msg : '保存或编辑失败',
                                type: 'fail',
                                delay: '3'
                            });
                            angular.element($event.target).attr('disabled',false);
                            angular.element($event.target).removeClass('disabled');
                        }
                })
                .error(function(data){
                    alert.alert({
                        reason: '此提示3秒后关闭',
                        message: '网络异常，请重试！',
                        type: 'fail',
                        delay: '3'
                    })
                    angular.element($event.target).attr('disabled',false);
                    angular.element($event.target).removeClass('disabled');
                })
            }

        }
    }]);

    //    ]]>
</script>
</body>
</html>